<template>
  <div class="topic-list">
      <div v-for="(topic,index) in topic_list" :key="index">
        <artical-card :user="topic.user" :topic="topic.topic" v-if="topic.type==='artical'"></artical-card>
        <goods-card :user="topic.user" :topic="topic.topic" v-if="topic.type==='goods'"></goods-card>
        <idea-card :user="topic.user" :topic="topic.topic" v-if="topic.type==='idea'"></idea-card>
        <lostandfound-card :user="topic.user" :topic="topic.topic" v-if="topic.type==='laf'"></lostandfound-card>
        <question-card :user="topic.user" :topic="topic.topic" v-if="topic.type==='question'"></question-card>
      </div>
  </div>
</template>

<script>
import artical from "../Card/artical";
import goods from "../Card/goods";
import idea from "../Card/idea";
import lostandfound from "../Card/lostandfound";
import question from "../Card/question";
export default {
  name: "topic-list",
  props: {
    section: {
      type: [String, Array],
    },
    usertype: {
      type: [String, Array],
    },
    topictype: {
      type: [String, Array],
    },
  },
  data() {
    return {
      topic_list: [],
    };
  },
  mounted() {
    this.commen.getTopicList(
      {
        section: this.section,
        usertype: this.usertype,
        topictype: this.topictype,
        limit: 30,
        start: 0,
      },
      (res) => {
        if (res.data.status === 200) {
          this.topic_list = res.data.topics;
        }
      }
    );
  },
  methods: {},
  components: {
    "artical-card": artical,
    "goods-card": goods,
    "idea-card": idea,
    "lostandfound-card": lostandfound,
    "question-card": question,
  },
};
</script>

<style>
</style>